import 'package:flutter/material.dart';
import 'package:wsc2022/newsDetail_page.dart';

class TabView1 extends StatefulWidget {
  const TabView1({super.key});

  @override
  State<TabView1> createState() => _TabView1State();
}

class _TabView1State extends State<TabView1> {
  Color _titleColor = Color.fromRGBO(0, 55, 100, 1);
  @override
  Widget build(BuildContext context) {
    return Container(
      margin: EdgeInsets.symmetric(horizontal: 20),
      child: ListView(
        padding: EdgeInsets.zero,
        children: [
          SizedBox(
            height: 20,
          ),
          NewWidget(titleColor: _titleColor),
          NewWidget(titleColor: _titleColor),
          NewWidget(titleColor: _titleColor),
          NewWidget(titleColor: _titleColor),
          NewWidget(titleColor: _titleColor),
          NewWidget(titleColor: _titleColor),
          NewWidget(titleColor: _titleColor),
          NewWidget(titleColor: _titleColor),
          NewWidget(titleColor: _titleColor),
          NewWidget(titleColor: _titleColor),
          NewWidget(titleColor: _titleColor),
          NewWidget(titleColor: _titleColor),
          NewWidget(titleColor: _titleColor),
          NewWidget(titleColor: _titleColor),
        ],
      ),
    );
  }
}

class NewWidget extends StatelessWidget {
  const NewWidget({
    super.key,
    required Color titleColor,
  }) : _titleColor = titleColor;

  final Color _titleColor;

  @override
  Widget build(BuildContext context) {
    return GestureDetector(
      onTap: () {
        Navigator.push(context, MaterialPageRoute(builder: (context) {
          return NewsDetailPage();
        }));
      },
      child: Container(
        margin: EdgeInsets.only(bottom: 10),
        height: 100,
        decoration: BoxDecoration(
          borderRadius: BorderRadius.circular(20),
          color: Theme.of(context).primaryColor,
        ),
        child: Row(
          children: [
            ClipRRect(
              borderRadius: BorderRadius.horizontal(left: Radius.circular(20)),
              child: Image(
                height: 100,
                width: 140,
                image: AssetImage('images/newsbgc.png'),
                fit: BoxFit.cover,
              ),
            ),
            Expanded(
              child: Container(
                margin: EdgeInsets.symmetric(horizontal: 10),
                child: Column(
                  mainAxisAlignment: MainAxisAlignment.spaceAround,
                  children: [
                    Container(
                        alignment: Alignment.topLeft,
                        child: Text(
                          'Skills Changs Worlds',
                          style: TextStyle(
                              color: _titleColor,
                              fontWeight: FontWeight.w800,
                              fontSize: 20),
                        )),
                    Text(
                      "We've taken everything our Members shared with us in our first ever global Impact Survey and gathered impact stories that demonstrate how skills change worlds.",
                      maxLines: 1,
                      overflow: TextOverflow.ellipsis,
                      style: TextStyle(fontSize: 18, color: Color(0xFF9F9F9F)),
                    )
                  ],
                ),
              ),
            )
          ],
        ),
      ),
    );
  }
}
